<template>
    <div>
        <div>
            <div style="float:left">
                <Input style="width:250px" v-model="signature">
                <span slot="prepend">签名信息：</span>
                <Button slot="append" icon="ios-search" @click='findByInsName'></Button>
                </Input>
            </div>
             <Button-group >
                <Button @click="addApp">将签名添加到应用</Button>
            </Button-group>
    
        </div>
    
        <Table border stripe :columns="header" :data="data_list" size="small" ref="table" class="table"  @on-selection-change='rowSelect'></Table>
    
    </div>
</template>
<script>
export default {
    data() {
        return {

            //初始化url
            init_url: '/mes/core/smsTemp/all/exclude?id=',

            //应用添加url
            app_add_url:'/mes/core/smsTemp/all',

            //表格标题
            header: [
                {
                    type: 'selection',
                    width: 60,
                    align: 'center'
                },
                {
                    type: 'index',
                    width: 60,
                    align: 'center'
                },
                 {
                    "title": "模板名称",
                    "key": "name",
                    "width": 150,
                    "sortable": true,
                },
                {
                    "title": "模板code",
                    "key": "code",
                    "width": 130,
                    "sortable": true,
                },
                {
                    "title": "模板类型",
                    "key": "templateType",
                    "width": 120,
                    "sortable": true,
                    align: 'center',
                },
                {
                    "title": "模板内容",
                    "key": "content",
                    "min-width": 250,
                },
            ],
            ruleValidate: {
                name: [
                    { required: true, message: '姓名不能为空', trigger: 'blur' }
                ],
            },
            //表格数据源
            data_list: [],
            //表格数据源缓存
            data_cache_list: [],
            //选中的数据的应用id集合
            data_select_list:[],
            //查询的名称
            signature: '',

        }
    },
    methods: {
        //到处excel
        exportData(type) {
            if (type === 1) {
                this.$refs.table.exportCsv({
                    filename: '原始数据'
                });
            } else if (type === 2) {
                this.$refs.table.exportCsv({
                    filename: '排序和过滤后的数据',
                    original: false
                });
            }
        },

        //根据学院名称查询学院
        findByInsName() {
            this.signature = this.$stringUtil.stringTrim(this.signature);
            var signature = this.signature;

            if (signature == "") {
                this.data_list = this.data_cache_list.slice();
                return;
            }

            var match = this.$stringUtil.stringMatch;
            this.data_list = $.grep(this.data_cache_list, function (value) {
                if (match(value.signature, signature)) {
                    return value;
                }
            });
        },
        //选择变化的触发事件
        rowSelect(selection){
  
            if(selection && selection.length>0){
                var arr = [];
                for(var index in selection){
                    arr.push(selection[index].id);
                }
                this.data_select_list = arr; 
            }else{
                this.data_select_list = [];
            };
        },
        //将应用添加至学院
        addApp(){
            var _self = this;
            var func = this.appinit;

            if(this.data_select_list && this.data_select_list.length > 0){

                 this.$ajax.post(_self.app_add_url,{
                     tempIdList:_self.data_select_list,
                     appId:_self.appId
                 })
                 .then(function (response) {
                     if(response.data.status == "success"){
                         _self.$Message.info("添加成功");
                         func(_self);
                     }else{
                         _self.$Message.info("应用添加失败");
                     }
                 })
                 .catch(function (error) {
                     _self.$Message.info("应用添加失败");
                 })
            }else{
                _self.$Message.info("添加失败，未选择应用！");
            }

        },
        appinit(_self){
  
            var _self = this;
            this.$ajax.get(_self.init_url + _self.appId)
            .then(function (response) {
                _self.data_list = response.data;
                _self.data_cache_list = _self.data_list.slice();

                console.log(_self.data_list);
            })
            .catch(function (error) {
                console.log(error);
            });
        }

    },
    mounted() {

        var _self = this;

        //初始化表单数据
        // this.$ajax.get(_self.init_url)
        //     .then(function (response) {
        //         _self.data_list = response.data;
        //         _self.data_cache_list = _self.data_list.slice();
        //     })
        //     .catch(function (error) {
        //         console.log(error);
        //     });
    },
    props: ["appId"],
    watch: {
        appId: function (newValue, oldValue) {
            var _self = this;
            if(newValue == oldValue){
                return;
            }
            //初始化表单数据
            this.$ajax.get(_self.init_url + newValue)
            .then(function (response) {
                _self.data_list = response.data;
                _self.data_cache_list = _self.data_list.slice();
            })
            .catch(function (error) {
                console.log(error);
            });
        }
    }
}
</script>

<style>
.btn-group {
    margin-bottom: 5px;
}
</style>
